import Vue from 'vue';

Vue.directive('divDrag', {
  bind(el, binding, vnode, oldVnode) {
    let minWidth = 235;
    let maxWidth = 1000;
    const dragLine = el.querySelector('.drag-line');
    dragLine.onmousedown = (e) => {
      const clientX = e.clientX;
      let elW = el.clientWidth;

      document.onmousemove = function (e) {
        let wid = elW;
        e.preventDefault(); // 移动时禁用默认事件
        wid = elW + (e.clientX - clientX);
        if (wid >= minWidth && wid < maxWidth) {
          console.log(wid)
          el.style.width = wid + 'px';
        }
      };

      //拉伸结束

      document.onmouseup = function (e) {

        document.onmousemove = null;

        document.onmouseup = null;

      };

    }

  }

});
